import { useDebugValue, useEffect, useState } from "react";

const useCustomHook = () => {
  useDebugValue('hello')
  const [count, setCount] = useState(0)
  useDebugValue(count, (c) => c%2==0 ? 'even': 'odd')
  return [count, () => setCount(count+1)]
}

const Comp1 = () => {
  const [count, add] = useCustomHook()
  return <button onClick={() => add()}>comp1:{count}</button>
}

const Comp2 = () => {
  const [count, add] = useCustomHook()
  return <button onClick={() => add()}>comp2:{count}</button>
}

const CustomHookDemo = () => {
  return <>
    <Comp1 />
    <Comp2 />
  </>
}

export default CustomHookDemo;